<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC
  "-//W3C//DTD XHTML 1.0 Transitional//EN" 
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui"
	xmlns:c="http://java.sun.com/jsp/jstl/core"
	>
<h:head>
	<title>Principal</title>
</h:head>
<h:body>

<c:if test="#{carroMB.usuarioLogeado.nombreUsuario == null}">
<h>Usted no esta logueado, si ya se ha registrado ingrese <p:link outcome="ingresar" value="aqui"></p:link>
 , si aun no esta registrado, puede <p:link outcome="registrar" value="registrarse"></p:link></h> 
</c:if>
<c:if test="#{carroMB.usuarioLogeado.nombreUsuario != null}">
    <p:outputLabel value="Bienvenido : #{carroMB.usuarioLogeado.nombreUsuario}"></p:outputLabel>
</c:if>
    <h:form>
		<p:fieldset legend="Carrito de Compra"
			style="margin-bottom:20px; margin-left: auto;
	        margin-right: auto;">
			<p:messages id="messages" showDetail="false" autoUpdate="true"
				closable="true" />
            <h:outputLabel id="cont" value="Hay #{carroMB.cantidad} productos en el carro"/> <br/>
            <h:outputLabel id="total" value="Total: #{carroMB.total} "/><br/>
            <p:commandButton value="Editar Carro"  action="#{carroMB.editarCarro}"/>      
			<h:panelGrid columns="1">

				<p:dataTable id="listadoProducto" var="producto" value="#{carroMB.listaProducto}" rows="10"
					paginator="true"
					paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
					rowsPerPageTemplate="10">
					<p:column headerText="Producto">
						<h:outputText value="#{producto.nombre}" />
					</p:column>
					<p:column headerText="Descripcion">
						<h:outputText value="#{producto.descripcion}" />
					</p:column>
					<p:column headerText="Precio">
						<h:outputText value="#{producto.precio}" />
					</p:column>
					<p:column headerText="Stock">
						<h:outputText value="#{producto.stock}" />
					</p:column>
					<p:column headerText="Accion">
						<p:commandButton value="Agregar al carro"  styleClass="ui-priority-primary">
                        <p:ajax event="click" listener="#{carroMB.agregarProductoCarro(producto)}" update="@form"/>
                        </p:commandButton>
					</p:column>
				</p:dataTable>
			</h:panelGrid>
		</p:fieldset>
	</h:form>
</h:body>
</html>